<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="service.ShenqingService" %>
<%@ page import="beans.Shenqing" %>
<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.util.List" %>
<%@ page import="beans.Vehicle" %>
<%@ page import="beans.Drivers" %>
<%
    // 检查session是否存在
    if(session.getAttribute("username") == null) {
        response.sendRedirect(request.getContextPath() + "/login.jsp");
        return;
    }
    String username = (String)session.getAttribute("username");
    String role = (String)session.getAttribute("role");
    
    // 获取申请ID
    String orderId = request.getParameter("orderId");
    ShenqingService shenqingService = new ShenqingService();
    Shenqing shenqing = null;
    try {
        shenqing = shenqingService.getShenqingById(orderId);
    } catch (Exception e) {
        e.printStackTrace();
    }
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>申请详情 - 公司用车管理系统</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <style>
        /* 全局样式 */
        body {
            margin: 0;
            padding: 0;
            font-family: "Microsoft YaHei", Arial, sans-serif;
            background: #f6f6f6; /* 保持浅灰色背景 */
            color: #333;
            line-height: 1.6; /* 增加行高，提高可读性 */
        }

        /* 头部样式 */
        .header {
            background: linear-gradient(to right, #183a8a, #2a62b8); /* 添加渐变背景 */
            color: #fff;
            font-size: 2rem; /* 保持字体大小 */
            font-weight: bold;
            padding: 15px 30px; /* 调整内边距，增大页头 */
            letter-spacing: 1px; /* 微调字间距 */
            display: flex;
            align-items: center;
            justify-content: space-between; /* 保持标题和用户信息靠两边 */
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* 添加阴影 */
        }

        .header-right {
            display: flex;
            align-items: center;
            margin-right: 10px; /* 调整右侧间距 */
            font-size: 1rem;
        }
        .user-icon {
            width: 35px; /* 调整图标大小 */
            height: 35px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.9); /* 更明显的白色背景 */
            color: #183a8a;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem; /* 调整图标大小 */
            margin-right: 8px; /* 调整间距 */
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
        }
        .user-info {
            margin-right: 15px; /* 调整间距 */
            color: #e0e0e0; /* 调整字体颜色 */
        }
        .bell-icon {
            font-size: 1.2rem; /* 调整图标大小 */
            margin-right: 15px; /* 调整间距 */
            color: #fff;
        }
        .logout {
            color: #fff;
            text-decoration: none;
            margin-left: 8px; /* 调整间距 */
            font-size: 0.95rem; /* 微调字体大小 */
            padding: 6px 12px; /* 调整内边距 */
            border-radius: 4px;
            background: rgba(255,255,255,0.15); /* 微调背景透明度 */
            transition: background 0.3s ease;
        }
        .logout:hover {
            background: rgba(255,255,255,0.3); /* 微调hover背景 */
        }

        /* 主体容器 */
        .container {
            display: flex;
            height: calc(100vh - 65px); /* 根据新的页头高度调整 */
        }

        /* 侧边栏样式 */
        .sidebar {
            width: 240px; /* 稍微增加侧边栏宽度 */
            background: #1f4e9c; /* 调整侧边栏背景色 */
            display: flex;
            flex-direction: column;
            padding-top: 15px; /* 调整内边距 */
            box-shadow: 2px 0 8px rgba(0,0,0,0.1); /* 调整阴影 */
        }
        .menu-item {
            color: #e0e0e0; /* 调整字体颜色 */
            padding: 16px 0 16px 35px; /* 调整内边距 */
            font-size: 1.1rem; /* 微调字体大小 */
            cursor: pointer;
            border-left: 5px solid transparent;
            transition: background 0.2s, border-left 0.2s, color 0.2s; /* 添加颜色过渡 */
            text-decoration: none;
            display: flex;
            align-items: center;
        }
        .menu-item i {
            margin-right: 12px; /* 调整间距 */
            width: 20px;
            text-align: center;
            color: #a0a0a0; /* 调整图标颜色 */
        }
        .menu-item.active, .menu-item:hover {
            background: #2a62b8; /* 调整hover背景色 */
            border-left: 5px solid #ffffff; /* 调整激活/hover边框颜色 */
            color: #ffffff; /* 调整激活/hover字体颜色 */
            font-weight: bold;
            box-shadow: inset 0 1px 4px rgba(0,0,0,0.1); /* 添加内阴影效果 */
        }
        .menu-item.active i, .menu-item:hover i {
             color: #ffffff; /* 调整激活/hover图标颜色 */
        }

        /* 主内容区样式 */
        .main-content {
            flex: 1;
            background: #fff;
            border: 1px solid #ddd; /* 调整边框 */
            border-left: none;
            margin: 15px; /* 添加外边距 */
            border-radius: 8px; /* 添加圆角 */
            box-shadow: 0 2px 8px rgba(0,0,0,0.1); /* 添加阴影 */
            padding: 30px; /* 保持内边距 */
            overflow-y: auto;
        }
        .page-title {
            font-size: 2rem; /* 调整字体大小 */
            color: #183a8a; /* 保持颜色 */
            margin-bottom: 25px; /* 调整间距 */
            padding-bottom: 10px; /* 调整内边距 */
            border-bottom: 2px solid #eee; /* 保持边框 */
            position: relative;
        }
        .page-title::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0;
            width: 80px; /* 调整下划线宽度 */
            height: 2px;
            background: #3ba0e9; /* 保持颜色 */
        }

        /* 申请详情样式 */
        .info-item {
            margin-bottom: 12px; /* 调整间距 */
            padding: 12px 15px; /* 调整内边距 */
            background: #eef4ff; /* 调整背景色 */
            border-left: 4px solid #183a8a; /* 添加左侧边框 */
            border-radius: 6px; /* 调整圆角 */
            transition: all 0.3s ease; /* 保持过渡效果 */
        }
        .info-item:hover {
            background: #dde7ff; /* 调整hover背景色 */
            transform: translateX(0); /* 移除hover位移 */
            box-shadow: 0 1px 6px rgba(0,0,0,0.1); /* 添加阴影 */
        }
        .info-item label {
            font-weight: bold;
            color: #183a8a; /* 保持颜色 */
            display: inline-block;
            width: 130px; /* 调整标签宽度 */
            margin-right: 20px; /* 调整间距 */
            vertical-align: top; /* 顶部对齐 */
        }
        .info-item span {
            color: #555; /* 调整字体颜色 */
            word-break: break-word; /* 长文本换行 */
        }

        /* 按钮样式 */
        .button-group {
            margin-top: 30px;
            display: flex;
            gap: 25px; /* 增加按钮间距 */
            justify-content: center;
        }
        .action-btn, .back-btn {
             padding: 12px 30px; /* 调整按钮内边距 */
             border: none;
             border-radius: 6px;
             cursor: pointer;
             font-size: 1.1rem;
             font-weight: bold;
             transition: all 0.3s ease;
             text-decoration: none; /* 确保a标签样式统一 */
             display: inline-block; /* 确保a标签可以应用padding */
             text-align: center; /* 居中文本 */
        }
        .approve-btn {
            background: #28a745; /* 保持颜色 */
            color: white;
        }
        .approve-btn:hover {
            background: #218838; /* 保持hover颜色 */
            transform: translateY(-2px);
            box-shadow: 0 4px 10px rgba(40,167,69,0.3); /* 调整阴影 */
        }
        .reject-btn {
            background: #dc3545; /* 保持颜色 */
            color: white;
        }
        .reject-btn:hover {
            background: #c82333; /* 保持hover颜色 */
            transform: translateY(-2px);
            box-shadow: 0 4px 10px rgba(220,53,69,0.3); /* 调整阴影 */
        }
        .back-btn {
            background: #6c757d; /* 保持颜色 */
            color: white;
        }
        .back-btn:hover {
            background: #5a6268; /* 保持hover颜色 */
            transform: translateY(-2px);
            box-shadow: 0 4px 10px rgba(108,117,125,0.3); /* 调整阴影 */
        }

        /* 错误消息样式 */
        .error-message {
            color: #dc3545;
            font-weight: bold;
            text-align: center;
            margin-top: 20px;
        }
    </style>
</head>
<body>
    <div class="header">
        <div>公司用车管理系统</div>
        <div class="header-right">
            <div class="user-icon">👤</div>
            <div class="user-info">工号：<%=username%></div>
            <div class="bell-icon">🔔</div>
            <a href="<%=request.getContextPath()%>/login.jsp" class="logout">退出登录</a>
        </div>
    </div>


        <div class="main-content">
            <h1 class="page-title">申请详情</h1>

            <% if (shenqing != null) { %>
                <div class="info-item">
                    <label>申请编号：</label>
                    <span><%= shenqing.getOrderId() %></span>
                </div>
                <div class="info-item">
                    <label>申请人：</label>
                    <span>员工<%= shenqing.getEmployeeId() %></span>
                </div>
                <div class="info-item">
                    <label>用车时间：</label>
                    <span><%= new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(shenqing.getDepartureTime()) %></span>
                </div>
                <div class="info-item">
                    <label>预计归还时间：</label>
                    <span><%= new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(shenqing.getReturnTime()) %></span>
                </div>
                <div class="info-item">
                    <label>用车事由：</label>
                    <span><%= shenqing.getUsageReason() %></span>
                </div>
                <div class="info-item">
                    <label>目的地：</label>
                    <span><%= shenqing.getDestination() %></span>
                </div>
                <div class="info-item">
                    <label>随行人员：</label>
                    <span><%= shenqing.getPassengers() %></span>
                </div>
                <div class="info-item">
                    <label>备注：</label>
                    <span><%= shenqing.getRemarks() != null ? shenqing.getRemarks() : "无" %></span>
                </div>
                <div class="info-item">
                    <label>状态：</label>
                    <span><%= shenqing.getStatus() %></span>
                </div>

                <div class="selection-group" style="margin-bottom: 20px; text-align: center;">
<%--                    <div style="margin-bottom: 15px;">--%>
<%--                        <label for="vehicleSelect" style="font-weight: bold; color: #183a8a; margin-right: 10px;">选择车辆:</label>--%>
<%--                        <select id="vehicleSelect" name="vehicleId" style="padding: 8px; border-radius: 4px; border: 1px solid #ccc;">--%>
<%--                            <option value="">--请选择车辆--</option>--%>
<%--                            <% --%>
<%--                                List<Vehicle> vehicleList = (List<Vehicle>) request.getAttribute("vehicleList");--%>
<%--                                if (vehicleList != null) {--%>
<%--                                    for (Vehicle vehicle : vehicleList) {--%>
<%--                            %>--%>
<%--                                <option value="<%= vehicle.getVehicleId() %>"><%= vehicle.getLicensePlate() %> - <%= vehicle.getBrandModel() %></option>--%>
<%--                            <% --%>
<%--                                    }--%>
<%--                                }--%>
<%--                            %>--%>
<%--                        </select>--%>
<%--                    </div>--%>
<%--                    <div>--%>
<%--                        <label for="driverSelect" style="font-weight: bold; color: #183a8a; margin-right: 10px;">选择司机:</label>--%>
<%--                        <select id="driverSelect" name="driverId" style="padding: 8px; border-radius: 4px; border: 1px solid #ccc;">--%>
<%--                             <option value="">--请选择司机--</option>--%>
<%--                            <% --%>
<%--                                List<Drivers> driverList = (List<Drivers>) request.getAttribute("driverList");--%>
<%--                                if (driverList != null) {--%>
<%--                                    for (Drivers driver : driverList) {--%>
<%--                            %>--%>
<%--                                <option value="<%= driver.getDriverId() %>"><%= driver.getDriverName() %></option>--%>
<%--                            <% --%>
<%--                                    }--%>
<%--                                }--%>
<%--                            %>--%>
<%--                        </select>--%>
<%--                    </div>--%>
                </div>

                <div class="button-group">
                    <button class="action-btn approve-btn" onclick="assignDriverAndVehicle('<%=shenqing.getOrderId()%>')">
                        通过并分配司机
                    </button>
                    <button class="action-btn reject-btn" onclick="rejectApplication('<%=shenqing.getOrderId()%>')">
                        不通过驳回
                    </button>
                    <a href="${pageContext.request.contextPath}/ShenqingServlet?action=all" class="back-btn">返回列表</a>
                </div>
            <% } else { %>
                <div class="error-message">
                    <p>未找到申请信息或无权查看此申请</p>
                </div>
                <a href="${pageContext.request.contextPath}/ShenqingServlet?action=all" class="back-btn">返回列表</a>
            <% } %>
        </div>
    </div>

    <script>
        function approveApplication(orderId) {
            const vehicleSelect = document.getElementById('vehicleSelect');
            const driverSelect = document.getElementById('driverSelect');
            const vehicleId = vehicleSelect.value;
            const driverId = driverSelect.value;



            if(confirm('确定要通过此申请并分配司机吗？')) {
                window.location.href = '<%=request.getContextPath()%>/ShenqingServlet?action=approve&orderId=' + orderId + '&vehicleId=' + vehicleId + '&driverId=' + driverId;
            }
        }

        function rejectApplication(orderId) {
            if(confirm('确定要驳回此申请吗？')) {
                window.location.href = '${pageContext.request.contextPath}/ShenqingServlet?action=reject&orderId=' + orderId;
            }
        }

        function assignDriverAndVehicle(orderId) {
            window.location.href = 'AssignDriverAndVehicle.jsp?orderId=' + orderId;
        }
    </script>
</body>
</html> 